<template>
    <view class="container" :style="themeColor">
       <view class="main" v-for="(item,index) in detailList" :key="item.ID">
		   <view class="setMeal-product">
				<image class="image" :src="easyGetImgUrl(item.ProductImage)" mode="aspectFill" ></image>
				<view class="setMeal-product-item">
					<view>
						<view class="name text-show-line-2">{{item.Name}}</view>
						<view class="num">货号：{{item.SkuCode}}</view>
						<view class="num" v-if="item.BatchCodeArr.length > 0">批号：{{item.BatchCodeArr.join(",")}}</view>
						<view class="num" v-if="item.SupplierName">厂家：{{item.SupplierName}}</view>
					</view>
				</view>
		   </view>
		   <view class="down-menu">
			   <view v-if="item.ProductData.length > 0 || item.InspectData.length > 0 || item.SupplierData.length > 0" class="batch" @click="batch(item)">批量下载</view>
			   <view v-if="item.ProductData.length > 0" @click="down(item.ProductData)"><!-- <uni-icons type="download" size="30" customIcons="icon-gray-1"></uni-icons> -->产品资料</view>
			   <view v-if="item.InspectData.length > 0" @click="down(item.InspectData)"><!-- <uni-icons type="download" size="30" customIcons="icon-gray-1"></uni-icons> -->检验报告</view>
			   <view v-if="item.SupplierData.length > 0" @click="down(item.SupplierData)"><!-- <uni-icons type="download" size="30" customIcons="icon-gray-1"></uni-icons> -->首营资料</view>
		   </view>
	   </view>
	   <privacy-agreement></privacy-agreement>
    </view>
</template>

<script>
import privacyAgreement from "@/components/privacy-agreement/privacy-agreement.vue"
import storage from "@/uni-sub-base/utils/storage.js"
import { getOrderDetail} from "@/service/api/order.js"
export default {
    components: {
		privacyAgreement
    },
    data() {
        return {
            orderId: "",
			data:{},
			detailList:[]
        }
    },
    watch: {
       
    },
    computed: {
        
    },
    onLoad(e) {
        this.orderId = e.orderId
		
    },
    onShow() {},
    mounted() {
        this.getDetail()
		uni.saveImageToPhotosAlbum({
		    filePath: this.orderId,
			success: () => {
		    },
		    fail: (error) => {
		    },
		})
    },
    methods: {
       getDetail() {
           let param = {
               orderId: this.orderId,
           }
           getOrderDetail(param).then((res) => {
               if (res.State == 1) {
                   this.data = res.Data.OrderDetail
                   this.detailList = this.data.DetailList
				   this.detailList.forEach((e,index)=>{
					   if(e.GiftId==-1){
						   this.detailList.splice(index,1)
					   }
				   })
               }
           })
       },
	   down(data){
		   let UrlArr = [];
		   data.forEach((e)=> {
			   if(e.UrlArr.length > 0){
				 UrlArr = UrlArr.concat(e.UrlArr)  
			   }
		   })
		   UrlArr.forEach((item,index)=> {
				UrlArr[index] = this.easyGetImgUrl(item)
		   })
		   console.log(UrlArr)
		   uni.previewImage({
		       current: 0,
		       urls: UrlArr,
		       longPressActions: {
		           itemList: ["保存图片"],
		           success: function (ress) {
		               uni.downloadFile({
		                   url: item,
		                   success: (res) => {
		                       if (res.statusCode === 200) {
		                           uni.saveImageToPhotosAlbum({
		                               filePath: res.tempFilePath,
		                               success: function () {
		                                   //uniapp提供的消息提示框。
		                                   uni.showToast({
		                                       title: "保存成功",
		                                       icon: "success",
		                                   })
		                               },
		                               fail: function () {
		                                   uni.showToast({
		                                       title: "保存失败，请稍后重试",
		                                       icon: "none",
		                                   })
		                               },
		                           })
		                       }
		                   },
		               })
		           },
		           fail: function (res) {
		               console.log(res.errMsg)
		           },
		       },
		   })
        //     for (let i = 0; i < UrlArr.length; i++) {
        //         let url = this.easyGetImgUrl(UrlArr[i]);
        //         uni.downloadFile({
        //             url,
        //             success: (res) => {
        //                 // 获取到图片本地地址后再保存图片到相册（因为此方法不支持远程地址）
        //                 uni.saveImageToPhotosAlbum({
        //                     filePath: res.tempFilePath,
        //                     success: () => {
								// if(UrlArr.length - i == 1){
								// 	uni.hideLoading()
								// 	uni.showToast({
								// 	    title: "下载成功！",
								// 	})
								// }
        //                     },
        //                     fail: (error) => {
        //                         uni.showToast({
        //                             icon: "none",
        //                             title: "下载失败",
        //                         })
        //                     },
        //                 })
        //             },
        //         })
        //     }
	   },
	   batch(item){
		   let UrlArr = [];
		   if(item.ProductData.length > 0){
			   item.ProductData.forEach((e)=> {
				   if(e.UrlArr.length > 0){
					 UrlArr = UrlArr.concat(e.UrlArr)  
				   }
			   })
		   }
		   if(item.InspectData.length > 0){
			   item.InspectData.forEach((e)=> {
				   if(e.UrlArr.length > 0){
					 UrlArr = UrlArr.concat(e.UrlArr)  
				   }
			   })
		   }
		   if(item.SupplierData.length > 0){
			   item.SupplierData.forEach((e)=> {
				   if(e.UrlArr.length > 0){
					 UrlArr = UrlArr.concat(e.UrlArr)  
				   }
			   })
		   }
		   for (let i = 0; i < UrlArr.length; i++) {
		       let url = this.easyGetImgUrl(UrlArr[i]);
		       uni.downloadFile({
		           url,
		           success: (res) => {
		               // 获取到图片本地地址后再保存图片到相册（因为此方法不支持远程地址）
		               uni.saveImageToPhotosAlbum({
		                   filePath: res.tempFilePath,
		                   success: () => {
		   					if(UrlArr.length - i == 1){
		   						uni.hideLoading()
		   						uni.showToast({
		   						    title: "下载成功！",
		   						})
		   					}
		                   },
		                   fail: (error) => {
		                       uni.showToast({
		                           icon: "none",
		                           title: "下载失败",
		                       })
		                   },
		               })
		           },
		       })
		   }
		   
	   }
    },
}
</script>

<style lang="scss" scoped>
	.main{
		padding:24rpx;
		background: #fff;
		margin-bottom: 24rpx;
	}
	.setMeal-product{
		display: flex;
		.image{
			width: 180rpx;
			height: 180rpx;
			margin-right: 26rpx;
			flex-shrink: 0;
		}
		.setMeal-product-item{
			&>view{
				display: flex;
				height:100%;
				flex-direction: column;
				justify-content: space-between;
				
			}
			.name{
				font-size: 28rpx;
				font-weight: 500;
				color: #333333;
				padding-bottom: 8rpx;
			}
			.num{
				font-size: 24rpx;
				color: #666666;
				padding-top: 4rpx;
			}
	
				.del{
					font-size: 24rpx;
					color: #999999;
					font-weight: normal;
					text-decoration: line-through;
					padding-left: 6rpx;
				}
			}
		}

	.down-menu{
		display: flex;
		justify-content: flex-end;
		padding-top: 24rpx;
		&>view{
			width: 172rpx;
			height: 64rpx;
			background: #FFFFFF;
			border-radius: 32rpx;
			border: 1rpx solid #666666;
			font-size: 26rpx;
			color:#333;
			display: flex;
			justify-content: center;
			align-items: center;
			margin-left: 12rpx;
		}
		.batch{
			width: auto;
			border:none;
			font-size: 24rpx;
			color: #006EFF;
			padding-right: 24rpx;
		}
	}
</style>
